<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head th:replace="/public/css :: common_css(~{::title},~{::link})">
    <title>Role - KafkaEagle</title>
    <link th:href="@{/media/css/public/dataTables.bootstrap.min.css}" rel="stylesheet"/>
</head>
<body>
<nav th:replace="/public/navbar :: common_navbar"></nav>
<div id="wrapper">
    <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">
                    Role <small>overview</small>
                </h1>
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="alert alert-info alert-dismissable">
                    <button type="button" class="close" data-dismiss="alert"
                            aria-hidden="true">×
                    </button>
                    <i class="fa fa-info-circle"></i> <strong>Display the
                    role management list and configure the template directories that
                    each role can access.</strong>
                </div>
            </div>
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <i class="fa fa-cogs fa-fw"></i> Role Manager
                        <div class="pull-right"></div>
                    </div>
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <table id="result" class="table table-bordered table-condensed"
                               width="100%">
                            <thead>
                            <tr>
                                <th>Name</th>
                                <th>Describe</th>
                                <th>Operate</th>
                            </tr>
                            </thead>
                        </table>
                    </div>
                </div>
                <!-- /.col-lg-4 -->
            </div>
            <!-- /.row -->
        </div>
        <!-- modal -->
        <div class="modal fade" aria-labelledby="keModalLabel"
             aria-hidden="true" id="ke_setting_dialog" tabindex="-1"
             role="dialog">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button class="close" type="button" data-dismiss="modal">×</button>
                        <h4 class="modal-title" id="keModalLabel">
                            Role Setting
                        </h4>
                        <div id="ke_role_alert_mssage"></div>
                    </div>
                    <!-- /.row -->
                    <form role="form" action="#" method="post"
                          onsubmit="return contextFormValid();return false;">
                        <div class="modal-body">
                            <div id="treeview-checkable" class=""></div>
                        </div>
                        <div id="remove_div" class="modal-footer">
                            <button type="button" class="btn btn-primary"
                                    data-dismiss="modal">Close
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <!-- /#page-wrapper -->
    </div>
</div>
<div th:replace="/public/script :: common_js(~{::script})">
    <script th:src="@{/media/js/main/system/role.js}" type="text/javascript"></script>
    <script th:src="@{/media/js/plugins/datatables/jquery.dataTables.min.js}"></script>
    <script th:src="@{/media/js/plugins/datatables/dataTables.bootstrap.min.js}"></script>
</div>
</body>
</html>
